<template>
    <div class="wrapper">
        <addressTop :msg=msg />
        <div class="wrap" v-for="(item,index) in address1" :key="index">
            <div class="left">
                所在城市：
                <input class="right" placeholder="如北京市" type="text" v-model="item.city">
            </div>
            <div class="hr"></div>
            <div class="left">
                小区/大厦/学校：
                <input class="right" placeholder="如理工大学国防科技园" type="text" v-model="item.school">
            </div>
            <div class="hr"></div>
            <div class="left">
                楼号-门牌号：
                <input class="right" placeholder="A号楼B层" type="text" v-model="item.number">
            </div>
            <div class="hr"></div>
            <div class="left">
                收货人：
               <input class="right" placeholder="请填写收货人的姓名" type="text" v-model="item.name">
            </div>
            <div class="hr"></div>
            <div class="left">
                联系电话：
                <input class="right" placeholder="请填写收货手机号" type="number" v-model="item.phone">
            </div>
         
       </div>
    </div>
</template>

<script>
import addressTop from '@/components/addressTop.vue'
import {mapState,mapGetters,mapMutations} from 'vuex'
    export default{
        name: 'AddAddress',
        components: {
            addressTop
        },
        data(){
            return {
                
            }
        },
        computed:{
            ...mapState(['msg','address','address1'])
        },
        created(){
        
        },
        methods:{
            ...mapMutations(['address']),
           
        }
    }
</script>

<style lang="scss" scoped>
    .wrapper{
        min-height:100vh;
        background-color:#f1f1ee;
        width:100vw;
    }
    
    .wrap{
        width:100vw;
        background-color:white;
        .left{
            padding:3vw;
            
        }
        .right{
            font-size: 4vw;
            border: none;
            outline: none;
        }
        .hr{
            width: 94vw;
            height: 0.1vw;
            background-color: #cdcdcd;
            margin-left: 3vw;
        }
    }
</style>